<template>
  <div class="app-container">
     <el-form label-width="120px" :rules="saverules" :model="hospset" ref="formRef">
     
       <el-form-item label="医院名称" prop="hosname">
        <el-input v-model="hospset.hosname"/>
      </el-form-item>
      <el-form-item label="医院编号">
        <el-input v-model="hospset.hoscode"/>
      </el-form-item>
      <el-form-item label="api地址">
        <el-input v-model="hospset.apiUrl"/>
      </el-form-item>
      <el-form-item label="联系人">
        <el-input v-model="hospset.contactsName"/>
      </el-form-item>
      <el-form-item label="电话" prop="contactsPhone">
        <el-input v-model="hospset.contactsPhone"/>
      </el-form-item>
      <el-form-item>
        <el-button :disabled="saveBtnDisabled" type="primary" @click="saveOrUpdate('formRef')">保存</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>



<script>
import hospsetjs from '@/api/hospset.js'

export default {
  data(){
    return {
      saveBtnDisabled:false,
      hospset:{},
      saverules:{   // 存储验证信息
          hosname: [
            { required: true, message: '请输入医院名称', trigger: 'blur' },
            { min: 3, max: 20, message: '长度在 3 到 20 个字符', trigger: 'blur' }
          ],
          contactsPhone:[
            { required: true, message: '请输入手机号', trigger: 'blur' },
            { min: 11, max: 11, message: '请输入正确的手机号', trigger: 'blur' }
          ]
        }
    }
  },

  methods:{
     // 保存和修改医院信息
    saveOrUpdate(formName){
      //对ref名为forName（此处是formRef）的表单进行二次验证
      this.$refs[formName].validate((valid) => {
          if (valid) {
            // 将保存按钮开关打开，防止用户重复点击提交
             this.saveBtnDisabled=true;

            if(!this.hospset.id){
                //添加操作
                hospsetjs.addHosptail(this.hospset).then(resp=>{
                this.$message.success("添加成功");
                //路由跳转到如下地址
                this.$router.push({path:'/yygh/hospset/list'})
              })
            }else{
              //修改操作
             hospsetjs.update(this.hospset).then(resp=>{
                this.$message.success("修改成功");
                //路由跳转的
                this.$router.push({path:'/yygh/hospset/list'})
             })
            }
          } else {    // 不能通过二次表单验证
             this.$message.error("表单填写有误")
            return false;
          }
        });

    }
  },

  created(){
    if(this.$route.params && this.$route.params.id){
      var id = this.$route.params.id;
      hospsetjs.detail(id).then(resp=>{
        this.hospset = resp.data;
      })
    }
  }
}
</script>

